var ckbox = document.getElementsByClassName("ckbox");
var ckbtn = document.getElementsByClassName("ckbtn");
var plus = document.getElementsByClassName("plus");
var mins = document.getElementsByClassName("mins");
var txt = document.getElementsByClassName("txt");
var price = document.getElementsByClassName("price");
var totle = document.getElementsByClassName("totle");
var allprice = document.getElementsByClassName("totleprice")[0];
var number = document.getElementsByClassName("number")[0];
var count = 0;
//商品信息前复选框的事件
for (var i = 0; i < ckbtn.length; i++) {
    ckbtn[i].onclick = function () {
        if (this.checked) {
            count++;
        }
        else {
            count--;
        }
        if (count == ckbtn.length) {
            ckbox[0].checked = true;
            ckbox[1].checked = true;
        }
        else {
            ckbox[0].checked = false;
            ckbox[1].checked = false;
        }
        ischoose();
    }
}
//全选复选框的事件
for (key in ckbox) {
    ckbox[key].index = key;  //给index属性上绑值，绑个索引
    ckbox[key].onclick = function () {
        ckbox[this.index == 0 ? 1 : 0].checked = !ckbox[this.index == 0 ? 1 : 0].checked;
        if (this.checked) {
            for (var i = 0; i < ckbtn.length; i++) {
                ckbtn[i].checked = true;
            }
        }
        else {
            for (var i = 0; i < ckbtn.length; i++) {
                ckbtn[i].checked = false;
            }
        }
        ischoose();
    }
}
//购物车数量的增减事件
for (var i = 0; i < plus.length; i++) {
    plus[i].index = i;
    plus[i].onclick = function () {
        var val = txt[this.index].value;
        val--;
        if (val < 1) {
            val = 1;
        }
        txt[this.index].value = val;
        addprice(this.index, val);
        ischoose();
    }
    mins[i].index = i;
    mins[i].onclick = function () {
        var val = txt[this.index].value;
        val++;
        txt[this.index].value = val;
        addprice(this.index, val);
        ischoose();
    }
}
//金额的计算方法
function addprice(index, value) {
    totle[index].innerHTML = "￥" + (price[index].getAttribute("data-price") * value).toFixed(2);
    totle[index].setAttribute("data-totle", (price[index].getAttribute("data-price") * value).toFixed(2));
}
//判断商品信息前的复选框是否打勾
function ischoose() {
    var totleprice = 0;
    var num = 0;
    for (var i = 0; i < ckbtn.length; i++) {
        if (ckbtn[i].checked) {
            totleprice += parseFloat(totle[i].getAttribute("data-totle"));
            num += parseInt(txt[i].value);
        }
    }
    allprice.innerHTML = "￥" + totleprice.toFixed(2);
    number.innerHTML = num;
}


/*
问题：点第一个“全选”按钮时，第二个“全选”按钮自动打钩，反之亦然
解决思路：存值，即给index属性上绑值，绑个索引
解决方法：判断当前index属性的索引，找到其相反的索引值（只有两个“全选”按钮，因此若当前索引为0，找到索引为1的那个；反之亦然），使其复选框前打钩
代码如下：*/
for (key in ckbox) {
    ckbox[key].index = key;  //给index属性上绑值，绑个索引
    ckbox[key].onclick = function () {
        ckbox[this.index == 0 ? 1 : 0].checked = true;
        for (var i = 0; i < ckbtn.length; i++) {
            ckbtn[i].checked = true;
        }
    }
}
